<template>
  <a-modal
    class="width-mad-style"
    :title="title"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @cancel="handleCancel"
    @ok="handleCancel"
    cancelText="关闭">
    <a-row :gutter="20">
      <a-form :form="form">
        <a-form-item style="">
<!--          <a-button type="primary" @click="DownLoadPDF(docName,recordId)" style="margin-left: 10px"-->
<!--                    :disabled=checkedDownload>下载pdf-->
<!--          </a-button>-->
          <a-button type="primary" @click="DownLoadClick(docName,recordId)"
                    style="margin-left: 15px;margin-bottom: 15px" :disabled=checkedDownload>下载word
          </a-button>
        </a-form-item>
        <a-col :span="24">
          <a-spin :spinning="confirmLoading">

            <a-row :gutter="26">
              <a-col class="gutter-row" :span="26">
                <div class="gutter-box">
                  <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :class="{'print-show-style':printShow}">
                    <j-editor v-decorator="['editor',{trigger:'input'}]"/>
                  </a-form-item>
                </div>
              </a-col>
            </a-row>

          </a-spin>
        </a-col>
      </a-form>
    </a-row>

  </a-modal>
</template>

<script>
  import JCategorySelect from '@/components/jeecg/JCategorySelect'
  import { httpAction } from '@/api/manage'
  import pick from 'lodash.pick'
  import JDate from '@/components/jeecg/JDate'
  import JDictSelectTag from '@/components/dict/JDictSelectTag'
  import JEditor from '@/components/jeecg/JEditorReadonly'
  import { getAction } from '@/api/manage'
  import { postAction, handleExportDoc,handleExportPDF } from '@/api/manage'

  export default {
    name: 'EditorInfoReadOnlyModal',
    components: {
      JDate,
      JDictSelectTag,
      JEditor,
      JCategorySelect
    },
    data () {
      return {
        docName: '',
        recordId: '',
        checkedDownload: false,
        checkedPrint: false,
        printShow: true,
        record: {},
        formLayout: 'horizontal',
        // form: this.$form.createForm(this, { name: 'coordinated' }),
        c: '',
        form: this.$form.createForm(this),
        title: '操作',
        // width: 100%,
        visible: false,
        model: '',
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        url: {
          addCount: "/doc/doc/addCount",
          list: '/doc/editor/list',
          add: '/doc/doc/add',
          addEditor: '/doc/doc/addEditor',
          edit: '/doc/doc/edit',
          queryById: '/doc/doc/queryById',
          queryId: '/doc/doc/queryId',
          downPdf:'/doc/doc/exportDoc'
        }
      }
    },
    created () {

    },
    methods: {
      DownLoadPDF(docName,recordId){
        this.axios({
          method: 'get',
          url: '/doc/doc/exportPDF',
          params: {
            docName:docName,
            recordId:recordId
          },
          responseType: "blob"
        }).then(res => {
          if (window.navigator && window.navigator.msSaveOrOpenBlob) {
            let blob = new Blob([res])
            window.navigator.msSaveOrOpenBlob(blob, docName+'.pdf')
          } else {
            /* 火狐谷歌的文件下载方式 */
            var blob = new Blob([res])
            var downloadElement = document.createElement('a')
            var href = window.URL.createObjectURL(blob)//创建下载的链接
            downloadElement.href = href
            downloadElement.download = docName+'.pdf'//下载后文件名
            document.body.appendChild(downloadElement)
            downloadElement.click()//点击下载
            document.body.removeChild(downloadElement)//下载完成移除元素
            window.URL.revokeObjectURL(href)//释放掉blob对象
          }
        }).catch((res)=>{
          console.log(res);
        })
        //handleExportPDF(docName,recordId)
      },
      DownLoadClick (docName, recordId) {
        handleExportDoc(docName, recordId)
      },
      handleSubmit (e) {
        e.preventDefault()
        this.form.validateFields((err, values) => {
          if (!err) {
            console.log('Received values of form: ', values)
          }
        })
      },
      handleSelectChange (value) {
        console.log(value)
        this.form.setFieldsValue({
          note: `Hi, ${value === 'male' ? 'man' : 'lady'}!`,
        })
      },
      //文档内容管理创建模块
      open (operation) {
        if (operation == 1) {
          getAction(this.url.list, 'get').then((res) => {
            //alert(JSON.stringify(res))
            if (res.success) {
              this.model = res.result.records[0].editor
              this.loading = false
            }
          })
          this.form.resetFields()
          this.visible = true
          this.$nextTick(() => {
            this.form.setFieldsValue(pick(this.model, 'editor'))
            //alert(JSON.stringify(this.model))
          })
        } else if (operation == 2) {
          this.form.resetFields()
          this.visible = true
        }
      },
      //文档内容管理查看按钮
      edit (key) {
        var formData = {
          id: key.toString()
        }
        getAction(this.url.queryById, formData).then((res) => {
          if (res.success) {
            if (this.title === '查看') { // 增加点击量
              getAction(this.url.addCount, formData)
            }
            this.record = res.result
            this.model = res.result.editor
            this.recordId = res.result.id
            this.docName = res.result.docName
            this.$nextTick(() => {
              this.form.setFieldsValue({ editor: this.model })
            })
            this.loading = false
          }
          this.$nextTick(() => {
            this.record.download == 1 ? this.checkedDownload = true : this.checkedDownload = false
            this.record.print == 1 ? this.checkedPrint = true : this.checkedPrint = false
            this.printShow = this.checkedPrint
          })
        })
        //this.form.resetFields();
        this.visible = true
      },
      close () {
        this.$emit('close')
        this.visible = false
      },
      add () {
        const that = this
        var formData = {
          editor: this.model
        }
        postAction(this.url.addEditor, formData, 'post').then((res) => {
          if (res.success) {
            that.$message.success(res.message)
            that.$emit('ok')
          } else {
            that.$message.warning(res.message)
          }
        }).finally(() => {
          that.confirmLoading = false
          that.close()
        })
      },
      //@ok="handleOk"
      handleOk () {
        const that = this
        // 触发表单验证
        this.form.validateFields((err, values) => {
          if (!err) {
            that.confirmLoading = true
            let httpurl = ''
            let method = ''
            if (!this.model.id) {
              httpurl += this.url.add
              method = 'post'
            } else {
              httpurl += this.url.edit
              method = 'put'
            }
            let formData = Object.assign(this.model, values)
            httpAction(httpurl, formData, method).then((res) => {
              if (res.success) {
                that.$message.success(res.message)
                that.$emit('ok')
              } else {
                that.$message.warning(res.message)
              }
            }).finally(() => {
              that.confirmLoading = false
              that.close()
            })
          }

        })
      },
      handleCancel () {
        this.close()
      },
      popupCallback (row) {
        this.form.setFieldsValue(pick(row, 'editor'))
      },

    }
  }
</script>
